<!DOCTYPE HTML>
<html style="background: #f3f3f3;" lang="zh-cmn-Hans">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>法援宝</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../css/lawyer.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../script/mobile.js"></script>
    <script type="text/javascript" src="../script/lawyer.js"></script>

    <link rel="stylesheet" type="text/css" href="../css/mobiscroll_002.css">
    <script src="../script/mobiscroll_002.js" type="text/javascript"></script>
    <script src="../script/mobiscroll_004.js" type="text/javascript"></script>
    <script src="../script/mobiscroll.js" type="text/javascript"></script>
    <script src="../script/mobiscroll_003.js" type="text/javascript"></script>
    <script src="../script/mobiscroll_005.js" type="text/javascript"></script>
</head>

<body>
    <div id="secHeader">
        <header class="header">
            <a href="javascript:void(0);" onclick="comeBack()" class="back_btn"><img src="../image/head-fanhui.png" alt=""></a>
            <h2>收支明细</h2>
            <!--<a href="javascript:void (0);" class="search_btn set_btn">设置</a>-->
        </header>
    </div>
    <div id="con">
        <!-- <section class="statistics">
    <div class="statistics_time">
        <div class="time">
            <p>本月</p>
            <span><em>收入：556.00</em> <em>支出：58.00</em></span>
        </div>
        <a href="javascript:void (0);" class="date_btn"><img src="../image/date_icon.png" alt=""></a>
    </div>
    <div class="budget_list">
        <ul>
            <li>
                <div class="income">
                    <p>收益</p>
                    <span>2017-6-1 09:35</span>
                </div>
                <em class="add_money">+8.66元</em>
            </li>

        </ul>
    </div>
    </section>
    <section class="statistics">
    <div class="statistics_time">
        <div class="time">
            <p>11月</p>
            <span><em>收入：556.00</em> <em>支出：58.00</em></span>
        </div>
    </div>
    <div class="budget_list">
        <ul>
            <li>
                <div class="income">
                    <p>收益</p>
                    <span>2017-6-1 09:35</span>
                </div>
                <em class="add_money">+8.66元</em>
            </li>

        </ul>
    </div>
    </section> -->
    </div>


</body>

<script>
    var date = '';
    apiready = function() {
        $api.fixStatusBar($api.dom('#secHeader'));
        api.setStatusBarStyle({
            style: 'light'
        });



        toDoRequest()

        //下拉刷新


    };


    function toDoRequest() {
        var p = {
            token: token,
            date: date
        };
        api.ajax({
            url: webSiteUrl + '/app/user/sbudget',
            method: 'post',
            data: {
                values: p
            }
        }, function(ret, err) {
            console.log(JSON.stringify(ret))
            if (ret.code == 200) {
                html = "";
                var t = ret.data;

                var tj = ret.data;
                //alert(tj.length);
                if (date == '') {

                    for (var i = 0; i < tj.length; i++) {
                        html += '<section class="statistics"><div class="statistics_time"><div class="time"><p>' + tj[i].monthname + '</p><span><em>收入：' + tj[i].monthmoney + '</em> <em>支出：0</em></span></div>';
                        if (i == 0) {
                            html +=
                                '<a href="javascript:void (0);" class="date_btn"  id="date1"><img src="../image/date_icon.png" alt=""><input onchange="datechoose()" readonly="readonly" name="appDateTime"  id="appDate" type="text"  class="hideinput"></a>';
                        }
                        html += '</div><div class="budget_list"><ul>';

                        var tjm = tj[i].month;

                        if (tjm.length > 0) {
                            for (var j = 0; j < tjm.length; j++) {
                                html += '<li><div class="income"><p>' + tjm[j].action + '</p><span>' + tjm[j].time + '</span></div><em class="add_money">+' + tjm[j].money + '元</em></li>';
                            }
                        }

                        html += '</ul></div></section>';

                    }

                } else {
                    html += '<section class="statistics"><div class="statistics_time"><div class="time"><p>' + tj.monthname + '</p><span><em>收入：' + tj.monthmoney + '</em> <em>支出：0</em></span></div>';

                    html +=
                        '<a href="javascript:void (0);" class="date_btn"  id="date1"><img src="../image/date_icon.png" alt=""><input onchange="datechoose()" readonly="readonly" name="appDateTime"  id="appDate" type="text"  class="hideinput"></a>';

                    html += '</div><div class="budget_list"><ul>';





                    var tj = ret.data.month;
                    if (tj != null) {
                        for (var i = 0; i < tj.length; i++) {
                            html += '<li><div class="income"><p>' + tj[i].action + '</p><span>' + tj[i].time + '</span></div><em class="add_money">+' + tj[i].money + '元</em></li>';

                        }
                    }

                    html += '</ul></div></section>';
                }

                $('#con').html(html);

                $("#appDate").mobiscroll($.extend(opt['date'], opt['default']));

            } else {

                $('#con').html('<p style="text-align:center">暂无数据</p>');


            }
        });

    }
    //时间选择
    var currYear = (new Date()).getFullYear();
    var opt = {};
    opt.date = {
        preset: 'date'
    };
    opt.datetime = {
        preset: 'datetime'
    };
    opt.time = {
        preset: 'time'
    };
    opt.default = {
        theme: 'android-ics light', //皮肤样式
        display: 'modal', //显示方式
        mode: 'scroller', //日期选择模式
        dateFormat: 'yyyy-mm',
        lang: 'zh',
        showNow: false,
        nowText: "今天",
        startYear: currYear, //开始年份
        endYear: currYear + 10 //结束年份
    };


    function datechoose() {
        date = $('#appDate').val()
        toDoRequest()
    }

    $("input[type='text']").on('change', function() {
        //do something;
    });
</script>

</html>
